<template>
    <div>
        <h2>功能简介</h2>
        <p>{{ intro }}</p>
        <ul>
          <li><strong>管理员模块：</strong> 负责系统整体管理，包括用户权限管理、商家审核、订单监控等。</li>
          <li><strong>用户模块：</strong> 提供用户注册、登录、商品浏览、购物车管理、订单生成等功能。</li>
          <li><strong>商家模块：</strong> 商家可以发布商品、管理库存、查看订单、处理退款等。</li>
        </ul>
      </div>
    </template>
    <script setup>
    import { ref } from 'vue';
    
    const intro = ref(
      "本项目是一个商城管理系统，分为管理员、用户、商家三个模块，每个模块有不同的功能需求。"
    );
    </script>
    <style>
    .introduction {
      width: 80%;
      margin: 20px auto;
      padding: 20px;
      border: 1px solid #ddd;
      border-radius: 8px;
      background-color: #f9f9f9;
    }
    
    h2 {
      color: #555;
    }
    
    ul {
      list-style-type: disc;
      padding-left: 20px;
    }
    </style>